<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Trackable Resources</title>
        <!-- Including Senna -->
        <script src="../../build/globals/senna-debug.js"></script>
        <link rel="stylesheet" href="../../build/senna.css">
        <link data-senna-track="temporary" rel="stylesheet" href="css/red_theme.css">
    </head>
    <body  data-senna>
        <div id="layout" class="content pure-g">
          <div id="nav" class="pure-u">
            <div class="nav-inner">
              <div class="header">
                <h1 class="brand-title">Trackable Stylesheets</h1>
                <p class="brand-tagline">Senna.js makes it easy to manage and reuse resources across pages.</p>
              </div>

              <div class="pure-menu pure-menu-open">
                <ul>
                  <li><a href="index.html">Home</a></li>
                  <li><a href="blue_profile.html">Blue Profile</a></li>
                  <li><a href="red_profile.html">Red Profile</a></li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        <div id="surface1" data-senna-surface>
            <div class="content">
                <header class="profile-header">
                  <img class="profile-avatar" alt="Zeno Rocha's avatar" height="48" width="48" src="../common/img/zeno.jpg">

                  <h2 class="profile-title">Zeno Rocha</h2>
                </header>

                <div class="profile-description">
                  <p>
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis omnis provident dolores praesentium eligendi accusantium voluptatum totam necessitatibus. Nisi asperiores molestiae ex, quaerat dolorum iure repellendus reprehenderit aliquid, minus libero rem aperiam fugit voluptatum. Esse, ex. Id aliquid culpa a.
                  </p>
                </div>
            </div>
        </div>
    </body>
</html>